﻿<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
    <meta charset="utf-8">
    <title>Evara - 网上茶叶商城</title>
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:title" content="">
    <meta property="og:type" content="">
    <meta property="og:url" content="">
    <meta property="og:image" content="">
    <link rel="shortcut icon" type="image/x-icon" href="../../imgs/theme/favicon.svg">
    <link rel="stylesheet" href="../../css/main.css?v=3.4">
</head>
<body>
<div class="modal fade custom-modal" id="quickViewModal" tabindex="-1" aria-labelledby="quickViewModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-6 col-sm-12 col-xs-12">
                        <div class="detail-gallery">
                            <span class="zoom-icon"><i class="fi-rs-search"></i></span>
                            <div class="product-image-slider">
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-2.jpg" alt="product image">
                                </figure>
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-1.jpg" alt="product image">
                                </figure>
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-3.jpg" alt="product image">
                                </figure>
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-4.jpg" alt="product image">
                                </figure>
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-5.jpg" alt="product image">
                                </figure>
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-6.jpg" alt="product image">
                                </figure>
                                <figure class="border-radius-10">
                                    <img src="../../imgs/shop/product-16-7.jpg" alt="product image">
                                </figure>
                            </div>
                            <div class="slider-nav-thumbnails pl-15 pr-15">
                                <div><img src="../../imgs/shop/thumbnail-3.jpg" alt="product image"></div>
                                <div><img src="../../imgs/shop/thumbnail-4.jpg" alt="product image"></div>
                                <div><img src="../../imgs/shop/thumbnail-5.jpg" alt="product image"></div>
                                <div><img src="../../imgs/shop/thumbnail-6.jpg" alt="product image"></div>
                                <div><img src="../../imgs/shop/thumbnail-7.jpg" alt="product image"></div>
                                <div><img src="../../imgs/shop/thumbnail-8.jpg" alt="product image"></div>
                                <div><img src="../../imgs/shop/thumbnail-9.jpg" alt="product image"></div>
                            </div>
                        </div>
                        <div class="social-icons single-share">
                            <ul class="text-grey-5 d-inline-block">
                                <li><strong class="mr-10">Share this:</strong></li>
                                <li class="social-facebook"><a href="#"><img
                                        src="../../imgs/theme/icons/icon-facebook.svg" alt=""></a></li>
                                <li class="social-twitter"><a href="#"><img
                                        src="../../imgs/theme/icons/icon-twitter.svg" alt=""></a></li>
                                <li class="social-instagram"><a href="#"><img
                                        src="../../imgs/theme/icons/icon-instagram.svg" alt=""></a></li>
                                <li class="social-linkedin"><a href="#"><img
                                        src="../../imgs/theme/icons/icon-pinterest.svg" alt=""></a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-md-6 col-sm-12 col-xs-12">
                        <div class="detail-info">
                            <h3 class="title-detail mt-30">Colorful Pattern Shirts HD450</h3>
                            <div class="product-detail-rating">
                                <div class="pro-details-brand">
                                    <span> Brands: <a href="/url/prolist">Bootstrap</a></span>
                                </div>
                                <div class="product-rate-cover text-end">
                                    <div class="product-rate d-inline-block">
                                        <div class="product-rating" style="width:90%">
                                        </div>
                                    </div>
                                    <span class="font-small ml-5 text-muted"> (25 reviews)</span>
                                </div>
                            </div>
                            <div class="clearfix product-price-cover">
                                <div class="product-price primary-color float-left">
                                    <ins><span class="text-brand">￥120.00</span></ins>
                                    <ins><span class="old-price font-md ml-15">￥200.00</span></ins>
                                    <span class="save-price  font-md color3 ml-15">25% Off</span>
                                </div>
                            </div>
                            <div class="bt-1 border-color-1 mt-15 mb-15"></div>
                            <div class="short-desc mb-30">
                                <p class="font-sm">Lorem ipsum dolor, sit amet consectetur adipisicing elit. Aliquam rem
                                    officia, corrupti reiciendis minima nisi modi,!</p>
                            </div>
                            <div class="attr-detail attr-color mb-15">
                                <strong class="mr-10">Color</strong>
                                <ul class="list-filter color-filter">
                                    <li><a href="#" data-color="Red"><span class="product-color-red"></span></a></li>
                                    <li><a href="#" data-color="Yellow"><span class="product-color-yellow"></span></a>
                                    </li>
                                    <li class="active"><a href="#" data-color="White"><span
                                            class="product-color-white"></span></a></li>
                                    <li><a href="#" data-color="Orange"><span class="product-color-orange"></span></a>
                                    </li>
                                    <li><a href="#" data-color="Cyan"><span class="product-color-cyan"></span></a></li>
                                    <li><a href="#" data-color="Green"><span class="product-color-green"></span></a>
                                    </li>
                                    <li><a href="#" data-color="Purple"><span class="product-color-purple"></span></a>
                                    </li>
                                </ul>
                            </div>
                            <div class="attr-detail attr-size">
                                <strong class="mr-10">Size</strong>
                                <ul class="list-filter size-filter font-small">
                                    <li><a href="#">S</a></li>
                                    <li class="active"><a href="#">M</a></li>
                                    <li><a href="#">L</a></li>
                                    <li><a href="#">XL</a></li>
                                    <li><a href="#">XXL</a></li>
                                </ul>
                            </div>
                            <div class="bt-1 border-color-1 mt-30 mb-30"></div>
                            <div class="detail-extralink">
                                <div class="detail-qty border radius">
                                    <a href="#" class="qty-down"><i class="fi-rs-angle-small-down"></i></a>
                                    <span class="qty-val">1</span>
                                    <a href="#" class="qty-up"><i class="fi-rs-angle-small-up"></i></a>
                                </div>
                                <div class="product-extra-link2">
                                    <button type="submit" class="button button-add-to-cart">加入购物车</button>
                                    <a aria-label="Add To Wishlist" class="action-btn hover-up"
                                       href="shop-wishlist.html"><i class="fi-rs-heart"></i></a>
                                    <a aria-label="Compare" class="action-btn hover-up" href="shop-compare.html"><i
                                            class="fi-rs-shuffle"></i></a>
                                </div>
                            </div>
                            <ul class="product-meta font-xs color-grey mt-50">
                                <li class="mb-5">SKU: <a href="#">FWM15VKT</a></li>
                                <li class="mb-5">Tags: <a href="#" rel="tag">Cloth</a>, <a href="#" rel="tag">Women</a>,
                                    <a href="#" rel="tag">Dress</a></li>
                                <li>Availability:<span class="in-stock text-success ml-5">8 Items In Stock</span></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<header class="header-area header-style-4 header-height-2">
    <div class="header-top header-top-ptb-1 d-none d-lg-block">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-xl-3 col-lg-4">
                    <div class="header-info">
                        <ul>
                            <li><i class="fi-rs-smartphone"></i> <a href="#">400-821-821</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-xl-6 col-lg-4">
                    <div class="text-center">
                        <div id="news-flash" class="d-inline-block">
                            <ul>
                                <li>最高可得50%的折扣 <a href="/url/prolist">查看详情</a></li>
                                <li>参与活动-节省更多的优惠券</li>
                                <li>龙井碧螺春，今天节省35%的折扣 <a href="/url/prolist">立即购买</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4">
                    <div class="header-info header-info-right">
                        <ul>
                            <li><i class="fi-rs-user"></i><a href="/url/login">欢迎user2用户</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="header-middle header-middle-ptb-1 d-none d-lg-block">
        <div class="container">
            <div class="header-wrap">
                <div class="logo logo-width-1">
                    <a href="/url/index"><img src="../../imgs/theme/logo.svg" alt="logo"></a>
                </div>
                <div class="header-right">
                    <div class="search-style-2">
                        <form action="" onsubmit="return false;">
                            <select class="select-active">
                                <option>所有分类</option>
                                <option>绿茶</option>
                                <option>红茶</option>
                                <option>乌龙茶</option>
                                <option>白茶</option>
                                <option>黄茶</option>
                                <option>黑茶</option>
                                <option>花茶</option>
                            </select>
                            <input id="keyword" type="text" placeholder="搜索商品..." onchange="searchProduct(1,true)">
                        </form>
                    </div>
                    <div class="header-action-right">
                        <div class="header-action-2">
                            <div class="header-action-icon-2">
                                <a class="mini-cart-icon" href="/url/cart">
                                    <img alt="Evara" src="../../imgs/theme/icons/icon-cart.svg">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="header-bottom header-bottom-bg-color sticky-bar">
        <div class="container">
            <div class="header-wrap header-space-between position-relative">
                <div class="logo logo-width-1 d-block d-lg-none">
                    <a href="/url/index"><img src="../../imgs/theme/logo.svg" alt="logo"></a>
                </div>
                <div class="header-nav d-none d-lg-flex">
                    <div class="main-menu main-menu-padding-1 main-menu-lh-2 d-none d-lg-block">
                        <nav>
                            <ul>
                                <li><a class="active" href="/url/index">主页 <i class="fi-rs-angle-down"></i></a>
                                    <ul class="sub-menu">
                                        <li><a href="/url/index">主页</a></li>
                                    </ul>
                                </li>
                                <li class="position-static"><a href="#">购物 <i class="fi-rs-angle-down"></i></a>
                                    <ul class="mega-menu">
                                        <li class="sub-mega-menu sub-mega-menu-width-22">
                                            <a class="menu-title" href="#">绿茶</a>
                                            <ul>
                                                <li><a href="/url/prolist">龙井</a></li>
                                                <li><a href="/url/prolist">碧螺春</a></li>
                                                <li><a href="/url/prolist">黄山毛峰</a></li>
                                                <li><a href="/url/prolist">普洱茶</a></li>
                                                <li><a href="/url/prolist">六堡茶</a></li>
                                                <li><a href="/url/prolist">安化黑茶</a></li>
                                            </ul>
                                        </li>
                                        <li class="sub-mega-menu sub-mega-menu-width-22">
                                            <a class="menu-title" href="#">红茶</a>
                                            <ul>
                                                <li><a href="/url/prolist">祁门红茶</a></li>
                                                <li><a href="/url/prolist">正山小种</a></li>
                                                <li><a href="/url/prolist">金骏眉</a></li>
                                                <li><a href="/url/prolist">滇红</a></li>
                                                <li><a href="/url/prolist">蒙顶黄芽</a></li>
                                                <li><a href="/url/prolist">君山银针</a></li>
                                            </ul>
                                        </li>
                                        <li class="sub-mega-menu sub-mega-menu-width-22">
                                            <a class="menu-title" href="#">乌龙茶</a>
                                            <ul>
                                                <li><a href="/url/prolist">武夷岩茶</a></li>
                                                <li><a href="/url/prolist">铁观音</a></li>
                                                <li><a href="/url/prolist">四川藏茶</a></li>
                                                <li><a href="/url/prolist">大红袍</a></li>
                                                <li><a href="/url/prolist">凤凰单丛</a></li>
                                                <li><a href="/url/prolist">白毫银针</a></li>
                                            </ul>
                                        </li>
                                        <li class="sub-mega-menu sub-mega-menu-width-34">
                                            <div class="menu-banner-wrap">
                                                <a href="/url/prolist"><img
                                                        src="../../imgs/banner/menu-banner.jpg" alt="Evara"></a>
                                                <div class="menu-banner-content">
                                                    <h4>热卖中</h4>
                                                    <h3>不要错过<br> 最近趋势</h3>
                                                    <div class="menu-banner-price">
                                                        <span class="new-price text-success">节省 50%</span>
                                                    </div>
                                                    <div class="menu-banner-btn">
                                                        <a href="/url/prolist">立即购买</a>
                                                    </div>
                                                </div>
                                                <div class="menu-banner-discount">
                                                    <h3>
                                                        <span>35%</span>
                                                        折扣
                                                    </h3>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </li>
                                <li><a href="#">我的 <i class="fi-rs-angle-down"></i></a>
                                    <ul class="sub-menu">
                                        <li><a href="/url/info">我的信息</a></li>
                                        <li><a href="/url/login">退出登录</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
                <div class="hotline d-none d-lg-block">
                    <p><i class="fi-rs-headset"></i><span>联系热线</span> 400-821-821 </p>
                </div>
                <p class="mobile-promotion">Happy <span class="text-brand">Mother's Day</span>. Big Sale Up to 40%</p>
                <div class="header-action-right d-block d-lg-none">
                    <div class="header-action-2">
                        <div class="header-action-icon-2">
                            <a href="shop-wishlist.html">
                                <img alt="Evara" src="../../imgs/theme/icons/icon-heart.svg">
                                <span class="pro-count white">4</span>
                            </a>
                        </div>
                        <div class="header-action-icon-2">
                            <a class="mini-cart-icon" href="shop-cart.html">
                                <img alt="Evara" src="../../imgs/theme/icons/icon-cart.svg">
                                <span class="pro-count white">2</span>
                            </a>
                            <div class="cart-dropdown-wrap cart-dropdown-hm2">
                                <ul>
                                    <li>
                                        <div class="shopping-cart-img">
                                            <a href="shop-product-full.html"><img alt="Evara"
                                                                                  src="../../imgs/shop/thumbnail-3.jpg"></a>
                                        </div>
                                        <div class="shopping-cart-title">
                                            <h4><a href="shop-product-full.html">Plain Striola Shirts</a></h4>
                                            <h3><span>1 × </span>￥800.00</h3>
                                        </div>
                                        <div class="shopping-cart-delete">
                                            <a href="#"><i class="fi-rs-cross-small"></i></a>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="shopping-cart-img">
                                            <a href="shop-product-full.html"><img alt="Evara"
                                                                                  src="../../imgs/shop/thumbnail-4.jpg"></a>
                                        </div>
                                        <div class="shopping-cart-title">
                                            <h4><a href="shop-product-full.html">Macbook Pro 2022</a></h4>
                                            <h3><span>1 × </span>￥3500.00</h3>
                                        </div>
                                        <div class="shopping-cart-delete">
                                            <a href="#"><i class="fi-rs-cross-small"></i></a>
                                        </div>
                                    </li>
                                </ul>
                                <div class="shopping-cart-footer">
                                    <div class="shopping-cart-total">
                                        <h4>Total <span>￥383.00</span></h4>
                                    </div>
                                    <div class="shopping-cart-button">
                                        <a href="shop-cart.html">View cart</a>
                                        <a href="shop-checkout.html">Checkout</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="header-action-icon-2 d-block d-lg-none">
                            <div class="burger-icon burger-icon-white">
                                <span class="burger-icon-top"></span>
                                <span class="burger-icon-mid"></span>
                                <span class="burger-icon-bottom"></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</header>
<div class="mobile-header-active mobile-header-wrapper-style">
    <div class="mobile-header-wrapper-inner">
        <div class="mobile-header-top">
            <div class="mobile-header-logo">
                <a href="/url/index"><img src="../../imgs/theme/logo.svg" alt="logo"></a>
            </div>
            <div class="mobile-menu-close close-style-wrap close-style-position-inherit">
                <button class="close-style search-close">
                    <i class="icon-top"></i>
                    <i class="icon-bottom"></i>
                </button>
            </div>
        </div>
        <div class="mobile-header-content-area">
            <div class="mobile-search search-style-3 mobile-header-border">
                <form action="#">
                    <input type="text" placeholder="Search for items…">
                    <button type="submit"><i class="fi-rs-search"></i></button>
                </form>
            </div>
            <div class="mobile-menu-wrap mobile-header-border">
                <div class="main-categori-wrap mobile-header-border">
                    <a class="categori-button-active-2" href="#">
                        <span class="fi-rs-apps"></span> Browse Categories
                    </a>
                    <div class="categori-dropdown-wrap categori-dropdown-active-small">
                        <ul>
                            <li><a href="/url/prolist"><i class="evara-font-dress"></i>Women's Clothing</a></li>
                            <li><a href="/url/prolist"><i class="evara-font-tshirt"></i>Men's Clothing</a></li>
                            <li><a href="/url/prolist"><i class="evara-font-smartphone"></i> Cellphones</a></li>
                            <li><a href="/url/prolist"><i class="evara-font-desktop"></i>Computer & Office</a>
                            </li>
                            <li><a href="/url/prolist"><i class="evara-font-cpu"></i>Consumer Electronics</a>
                            </li>
                            <li><a href="/url/prolist"><i class="evara-font-home"></i>Home & Garden</a></li>
                            <li><a href="/url/prolist"><i class="evara-font-high-heels"></i>Shoes</a></li>
                            <li><a href="/url/prolist"><i class="evara-font-teddy-bear"></i>Mother & Kids</a>
                            </li>
                            <li><a href="/url/prolist"><i class="evara-font-kite"></i>Outdoor fun</a></li>
                        </ul>
                    </div>
                </div>
                <nav>
                    <ul class="mobile-menu">
                        <li class="menu-item-has-children"><span class="menu-expand"></span><a
                                href="/url/index">Home</a>
                            <ul class="dropdown">
                                <li><a href="/url/index">Home 1</a></li>
                                <li><a href="index-2.html">Home 2</a></li>
                                <li><a href="index-3.html">Home 3</a></li>
                                <li><a href="/url/index">Home 4</a></li>
                            </ul>
                        </li>
                        <li class="menu-item-has-children"><span class="menu-expand"></span><a
                                href="/url/prolist">shop</a>
                            <ul class="dropdown">
                                <li><a href="/url/prolist">Shop Grid – Right Sidebar</a></li>
                                <li><a href="shop-grid-left.html">Shop Grid – Left Sidebar</a></li>
                                <li><a href="shop-list-right.html">Shop List – Right Sidebar</a></li>
                                <li><a href="shop-list-left.html">Shop List – Left Sidebar</a></li>
                                <li><a href="/url/prolist">Shop - Wide</a></li>
                                <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Single
                                    Product</a>
                                    <ul class="dropdown">
                                        <li><a href="shop-product-full.html">Product – Right Sidebar</a></li>
                                        <li><a href="shop-product-left.html">Product – Left Sidebar</a></li>
                                        <li><a href="shop-product-full.html">Product – No sidebar</a></li>
                                    </ul>
                                </li>
                                <li><a href="shop-filter.html">Shop – Filter</a></li>
                                <li><a href="shop-wishlist.html">Shop – Wishlist</a></li>
                                <li><a href="shop-cart.html">Shop – Cart</a></li>
                                <li><a href="shop-checkout.html">Shop – Checkout</a></li>
                                <li><a href="shop-compare.html">Shop – Compare</a></li>
                            </ul>
                        </li>
                        <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Mega menu</a>
                            <ul class="dropdown">
                                <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Women's
                                    Fashion</a>
                                    <ul class="dropdown">
                                        <li><a href="shop-product-full.html">Dresses</a></li>
                                        <li><a href="shop-product-full.html">Blouses & Shirts</a></li>
                                        <li><a href="shop-product-full.html">Hoodies & Sweatshirts</a></li>
                                        <li><a href="shop-product-full.html">Women's Sets</a></li>
                                    </ul>
                                </li>
                                <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Men's
                                    Fashion</a>
                                    <ul class="dropdown">
                                        <li><a href="shop-product-full.html">Jackets</a></li>
                                        <li><a href="shop-product-full.html">Casual Faux Leather</a></li>
                                        <li><a href="shop-product-full.html">Genuine Leather</a></li>
                                    </ul>
                                </li>
                                <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Technology</a>
                                    <ul class="dropdown">
                                        <li><a href="shop-product-full.html">Gaming Laptops</a></li>
                                        <li><a href="shop-product-full.html">Ultraslim Laptops</a></li>
                                        <li><a href="shop-product-full.html">Tablets</a></li>
                                        <li><a href="shop-product-full.html">Laptop Accessories</a></li>
                                        <li><a href="shop-product-full.html">Tablet Accessories</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li class="menu-item-has-children"><span class="menu-expand"></span><a
                                href="blog-category-fullwidth.html">Blog</a>
                            <ul class="dropdown">
                                <li><a href="blog-category-grid.html">Blog Category Grid</a></li>
                                <li><a href="blog-category-list.html">Blog Category List</a></li>
                                <li><a href="blog-category-big.html">Blog Category Big</a></li>
                                <li><a href="blog-category-fullwidth.html">Blog Category Wide</a></li>
                                <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Single
                                    Product Layout</a>
                                    <ul class="dropdown">
                                        <li><a href="blog-post-left.html">Left Sidebar</a></li>
                                        <li><a href="blog-post-right.html">Right Sidebar</a></li>
                                        <li><a href="blog-post-fullwidth.html">No Sidebar</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </li>
                        <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Pages</a>
                            <ul class="dropdown">
                                <li><a href="page-about.html">About Us</a></li>
                                <li><a href="page-contact.html">Contact</a></li>
                                <li><a href="test.html">My Account</a></li>
                                <li><a href="/url/login">login/register</a></li>
                                <li><a href="page-purchase-guide.html">Purchase Guide</a></li>
                                <li><a href="page-privacy-policy.html">Privacy Policy</a></li>
                                <li><a href="page-terms.html">Terms of Service</a></li>
                                <li><a href="page-404.html">404 Page</a></li>
                            </ul>
                        </li>
                        <li class="menu-item-has-children"><span class="menu-expand"></span><a href="#">Language</a>
                            <ul class="dropdown">
                                <li><a href="#">English</a></li>
                                <li><a href="#">French</a></li>
                                <li><a href="#">German</a></li>
                                <li><a href="#">Spanish</a></li>
                            </ul>
                        </li>
                    </ul>
                </nav>
            </div>
            <div class="mobile-header-info-wrap mobile-header-border">
                <div class="single-mobile-header-info mt-30">
                    <a href="page-contact.html"> Our location </a>
                </div>
                <div class="single-mobile-header-info">
                    <a href="/url/login">Log In / Sign Up </a>
                </div>
                <div class="single-mobile-header-info">
                    <a href="#">(+01) - 2345 - 6789 </a>
                </div>
            </div>
            <div class="mobile-social-icon">
                <h5 class="mb-15 text-grey-4">Follow Us</h5>
                <a href="#"><img src="../../imgs/theme/icons/icon-facebook.svg" alt=""></a>
                <a href="#"><img src="../../imgs/theme/icons/icon-twitter.svg" alt=""></a>
                <a href="#"><img src="../../imgs/theme/icons/icon-instagram.svg" alt=""></a>
                <a href="#"><img src="../../imgs/theme/icons/icon-pinterest.svg" alt=""></a>
                <a href="#"><img src="../../imgs/theme/icons/icon-youtube.svg" alt=""></a>
            </div>
        </div>
    </div>
</div>
<main class="main">
    <div class="page-header breadcrumb-wrap">
        <div class="container">
            <div class="breadcrumb">
                <a href="/url/index" rel="nofollow">主页</a>
                <span></span> 商品详情
            </div>
        </div>
    </div>
    <section class="mt-50 mb-50">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="product-detail accordion-detail">
                        <div class="row mb-50">
                            <div class="col-md-6 col-sm-12 col-xs-12">
                                <div class="detail-gallery">
                                    <span class="zoom-icon"><i class="fi-rs-search"></i></span>
                                    <div class="product-image-slider">
                                        <figure class="border-radius-10" th:if="${product.mainimage eq null}">
                                            <img src="../../imgs/img.png" alt="product image" height="636px">
                                        </figure>
                                        <figure class="border-radius-10" th:if="${product.mainimage ne null}">
                                            <img th:src="${product.mainimage}" alt="product image" height="636px">
                                        </figure>
                                        <figure class="border-radius-10" th:each="item:${product.subimagesList}">
                                            <img th:src="${item}" alt="product image" height="636px">
                                        </figure>
                                    </div>
                                    <div class="slider-nav-thumbnails pl-15 pr-15">
                                        <div th:if="${product.mainimage eq null}"><img src="../../imgs/img.png" alt="product image" width="116px" height="116px"></div>
                                        <div th:if="${product.mainimage ne null}"><img th:src="${product.mainimage}" alt="product image" width="116px" height="116px"></div>
                                        <div th:each="item:${product.subimagesList}"><img th:src="${item}" alt="product image" width="116px" height="116px"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6 col-sm-12 col-xs-12">
                                <div class="detail-info">
                                    <h2 class="title-detail" th:text="${product.name}">唐狮2024春季新款长袖衬衫女彩色格子宽松休闲防晒上衣外套减龄</h2>
                                    <div class="product-detail-rating">
                                        <div class="pro-details-brand">
                                            <span th:text="${product.subtitle}"> 品牌: </span>
                                        </div>
                                        <div class="product-rate-cover text-end">
                                            <div class="product-rate d-inline-block">
                                                <div class="product-rating" style="width:90%">
                                                </div>
                                            </div>
                                            <span class="font-small ml-5 text-muted" th:text="${' ('+reviewCount+' 条评价)'}"> (25 条评价)</span>
                                        </div>
                                    </div>
                                    <div class="clearfix product-price-cover">
                                        <div class="product-price primary-color float-left">
                                            <ins><span class="text-brand" th:text="${'￥'+product.disprice}">￥120.00</span></ins>
                                            <ins><span class="old-price font-md ml-15" th:text="${'￥'+product.price}">￥200.00</span></ins>
                                            <span class="save-price  font-md color3 ml-15" th:text="${product.discount+'折扣'}">25% 折扣</span>
                                        </div>
                                    </div>
                                    <div class="bt-1 border-color-1 mt-15 mb-15"></div>
                                    <div class="short-desc mb-30">
                                        <p th:text="${product.subtitle}">唐狮2024春季新款长袖衬衫女彩色格子宽松休闲防晒上衣外套减龄</p>
                                    </div>
                                    <div class="product_sort_info font-xs mb-30">
                                        <ul>
                                            <li class="mb-10"><i class="fi-rs-crown mr-5"></i> 1 年质量保证
                                            </li>
                                            <li class="mb-10"><i class="fi-rs-refresh mr-5"></i> 30 天免费换货
                                            </li>
                                            <li><i class="fi-rs-credit-card mr-5"></i> 支持货到付款</li>
                                        </ul>
                                    </div>
                                    <div class="attr-detail attr-size mb-15">
                                        <strong class="mr-10">配送</strong>
                                        <ul class="list-filter size-filter font-small">
                                            <li><a href="#">云南昆明</a></li>
                                            <li class=""><a href="#">快递: 免运费</a></li>
<!--                                            <li><a href="#">L</a></li>-->
<!--                                            <li><a href="#">XL</a></li>-->
<!--                                            <li><a href="#">XXL</a></li>-->
                                        </ul>
                                    </div>
<!--                                    <div class="attr-detail attr-color mb-15">-->
<!--                                        <strong class="mr-10">颜色</strong>-->
<!--                                        <ul class="list-filter color-filter">-->
<!--                                            <li><a href="#" data-color="Red"><span class="product-color-red"></span></a>-->
<!--                                            </li>-->
<!--                                            <li><a href="#" data-color="Yellow"><span-->
<!--                                                    class="product-color-yellow"></span></a></li>-->
<!--                                            <li class="active"><a href="#" data-color="White"><span-->
<!--                                                    class="product-color-white"></span></a></li>-->
<!--                                            <li><a href="#" data-color="Orange"><span-->
<!--                                                    class="product-color-orange"></span></a></li>-->
<!--                                            <li><a href="#" data-color="Cyan"><span-->
<!--                                                    class="product-color-cyan"></span></a></li>-->
<!--                                            <li><a href="#" data-color="Green"><span class="product-color-green"></span></a>-->
<!--                                            </li>-->
<!--                                            <li><a href="#" data-color="Purple"><span-->
<!--                                                    class="product-color-purple"></span></a></li>-->
<!--                                        </ul>-->
<!--                                    </div>-->
<!--                                    <div class="attr-detail attr-size">-->
<!--                                        <strong class="mr-10">尺寸</strong>-->
<!--                                        <ul class="list-filter size-filter font-small">-->
<!--                                            <li><a href="#">S</a></li>-->
<!--                                            <li class="active"><a href="#">M</a></li>-->
<!--                                            <li><a href="#">L</a></li>-->
<!--                                            <li><a href="#">XL</a></li>-->
<!--                                            <li><a href="#">XXL</a></li>-->
<!--                                        </ul>-->
<!--                                    </div>-->
                                    <div class="bt-1 border-color-1 mt-30 mb-30"></div>
                                    <div class="detail-extralink">
                                        <div class="detail-qty border radius">
                                            <a href="#" class="qty-down"><i class="fi-rs-angle-small-down"></i></a>
                                            <span class="qty-val">1</span>
                                            <a href="#" class="qty-up"><i class="fi-rs-angle-small-up"></i></a>
                                        </div>
                                        <div class="product-extra-link2">
                                            <button type="submit" class="button button-add-to-cart" th:onclick="addCart(${product.proid})">加入购物车</button>
<!--                                            <a aria-label="Add To Wishlist" class="action-btn hover-up"-->
<!--                                               href="shop-wishlist.html"><i class="fi-rs-heart"></i></a>-->
<!--                                            <a aria-label="Compare" class="action-btn hover-up"-->
<!--                                               href="shop-compare.html"><i class="fi-rs-shuffle"></i></a>-->
                                        </div>
                                    </div>
                                    <ul class="product-meta font-xs color-grey mt-50">
                                        <li class="mb-5">SKU: <a href="#" th:text="${product.proid}">FWM15VKT</a></li>
<!--                                        <li class="mb-5">标签: <a href="#" rel="tag">女装</a>, <a href="#" rel="tag">花纹</a>,-->
<!--                                            <a href="#" rel="tag">裙子</a></li>-->
                                        <li>库存:<span
                                                class="in-stock text-success ml-5" th:text="${'库存 '+product.stock+' 件'}">库存 8 件</span></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-lg-10 m-auto entry-main-content">
                                <h2 class="section-title style-1 mb-30">描述</h2>
                                <div class="description mb-50">
                                    <p th:text="${product.description}"></p>
                                    <h4 class="mt-30">快递与配送</h4>
                                    <hr class="wp-block-separator is-style-wide">
                                    <p>我们的快递配送服务覆盖范围广泛，无论您身处城市的繁华地带还是偏远的乡村角落，我们都能为您提供及时准确的配送服务。我们拥有一支专业的配送团队，他们熟悉各种路况和配送流程，能够在最短的时间内将您的包裹送达目的地。
                                    </p>
                                    <p>同时，我们也非常重视客户的隐私和安全。在配送过程中，我们严格遵守相关法律法规，保护您的个人信息和包裹内容不被泄露。此外，我们还提供签收服务，确保包裹只能由指定的收件人签收，增加了配送的安全性。
                                    </p>
                                </div>
<!--                                <h3 class="section-title style-1 mb-30">产品信息</h3>-->
<!--                                <table class="font-md mb-30">-->
<!--                                    <tbody>-->
<!--                                    <tr class="stand-up">-->
<!--                                        <th>品牌</th>-->
<!--                                        <td>-->
<!--                                            <p>tonlion/唐狮</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="folded-wo-wheels">-->
<!--                                        <th>适用年龄</th>-->
<!--                                        <td>-->
<!--                                            <p>18-24周岁</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="folded-w-wheels">-->
<!--                                        <th>尺码</th>-->
<!--                                        <td>-->
<!--                                            <p>S M L XL</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="door-pass-through">-->
<!--                                        <th>颜色分类</th>-->
<!--                                        <td>-->
<!--                                            <p>芽黄 备用1 备用2</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="frame">-->
<!--                                        <th>年份季节</th>-->
<!--                                        <td>-->
<!--                                            <p>2024年春季</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="weight-wo-wheels">-->
<!--                                        <th>货号</th>-->
<!--                                        <td>-->
<!--                                            <p>629120015007</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="weight-capacity">-->
<!--                                        <th>服装版型</th>-->
<!--                                        <td>-->
<!--                                            <p>宽松型</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="width">-->
<!--                                        <th>材质成分</th>-->
<!--                                        <td>-->
<!--                                            <p>棉</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="handle-height-ground-to-handle">-->
<!--                                        <th>袖长</th>-->
<!--                                        <td>-->
<!--                                            <p>长袖</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->
<!--                                    <tr class="wheels">-->
<!--                                        <th>衣长</th>-->
<!--                                        <td>-->
<!--                                            <p>常规款</p>-->
<!--                                        </td>-->
<!--                                    </tr>-->

<!--                                    </tbody>-->
<!--                                </table>-->
                                <div class="social-icons single-share">
                                    <ul class="text-grey-5 d-inline-block">
                                        <li><strong class="mr-10">分享商品:</strong></li>
                                        <li class="social-facebook"><a href="#"><img
                                                src="../../imgs/theme/icons/icon-facebook.svg" alt=""></a></li>
                                        <li class="social-twitter"><a href="#"><img
                                                src="../../imgs/theme/icons/icon-twitter.svg" alt=""></a></li>
                                        <li class="social-instagram"><a href="#"><img
                                                src="../../imgs/theme/icons/icon-instagram.svg" alt=""></a></li>
                                        <li class="social-linkedin"><a href="#"><img
                                                src="../../imgs/theme/icons/icon-pinterest.svg" alt=""></a></li>
                                    </ul>
                                </div>
                                <h3 class="section-title style-1 mb-30 mt-30" >评价 (2)</h3>
                                <div class="comments-area style-2">
                                    <div class="row">
                                        <div class="col-lg-12">
                                            <h4 class="mb-30">顾客评价</h4>
                                            <div class="comment-list">
                                             <!--   <div class="single-comment justify-content-between d-flex" th:each="item:${reviewList}">
                                                    <div class="user justify-content-between d-flex">
                                                        <div class="thumb text-center">
                                                          &lt;!&ndash;  <img src="../../imgs/page/avatar-7.jpg" alt="">&ndash;&gt;
                                                           &lt;!&ndash; <h6><a href="#" th:text="${item.user.username}">z**1</a></h6>&ndash;&gt;
                                                            <h6><a href="#" th:text="${item.user.username}">z**1</a></h6>
                                                        </div>
                                                        <div class="desc">
                                                            <div class="product-rate d-inline-block">
                                                                <div class="product-rating" style="width:90%">
                                                                </div>
                                                            </div>
                                                            <p th:text="${item.content}">比想象的厚实，喜欢</p>
                                                            <div class="d-flex justify-content-between">
                                                                <div class="d-flex align-items-center">
                                                                    <p class="font-xs mr-30" th:text="${item.fmtCreatetime}">2024-03-01 12:12:21 </p>
&lt;!&ndash;                                                                    <a href="#" class="text-brand btn-reply">回复 <i&ndash;&gt;
&lt;!&ndash;                                                                            class="fi-rs-arrow-right"></i> </a>&ndash;&gt;
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>-->
                                                <div class="single-comment justify-content-between d-flex">
                                                    <div class="user justify-content-between d-flex">
                                                        <div class="thumb text-center">
                                                            <!-- 用户头像部分 -->
                                                            <!--<img src="../../imgs/page/avatar-7.jpg" alt="">-->
                                                            <h6><a href="#">user1</a></h6>
                                                        </div>
                                                        <div class="desc">
                                                            <div class="product-rate d-inline-block">
                                                                <div class="product-rating" style="width:80%"></div>
                                                            </div>
                                                            <p>好</p>
                                                            <div class="d-flex justify-content-between">
                                                                <div class="d-flex align-items-center">
                                                                    <p class="font-xs mr-30">2024-12-29 </p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <div class="single-comment justify-content-between d-flex">
                                                    <div class="user justify-content-between d-flex">
                                                        <div class="thumb text-center">
                                                            <!-- 用户头像部分 -->
                                                            <!--<img src="../../imgs/page/avatar-7.jpg" alt="">-->
                                                            <h6><a href="#">朱倩如</a></h6>
                                                        </div>
                                                        <div class="desc">
                                                            <div class="product-rate d-inline-block">
                                                                <div class="product-rating" style="width:70%"></div>
                                                            </div>
                                                            <p>可以</p>
                                                            <div class="d-flex justify-content-between">
                                                                <div class="d-flex align-items-center">
                                                                    <p class="font-xs mr-30">2025-01-03</p>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
<!--                                        <div class="col-lg-4">-->
<!--                                            <h4 class="mb-30">Customer reviews</h4>-->
<!--                                            <div class="d-flex mb-30">-->
<!--                                                <div class="product-rate d-inline-block mr-15">-->
<!--                                                    <div class="product-rating" style="width:90%">-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                                <h6>4.8 out of 5</h6>-->
<!--                                            </div>-->
<!--                                            <div class="progress">-->
<!--                                                <span>5 star</span>-->
<!--                                                <div class="progress-bar" role="progressbar" style="width: 50%;"-->
<!--                                                     aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">50%-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="progress">-->
<!--                                                <span>4 star</span>-->
<!--                                                <div class="progress-bar" role="progressbar" style="width: 25%;"-->
<!--                                                     aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="progress">-->
<!--                                                <span>3 star</span>-->
<!--                                                <div class="progress-bar" role="progressbar" style="width: 45%;"-->
<!--                                                     aria-valuenow="45" aria-valuemin="0" aria-valuemax="100">45%-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="progress">-->
<!--                                                <span>2 star</span>-->
<!--                                                <div class="progress-bar" role="progressbar" style="width: 65%;"-->
<!--                                                     aria-valuenow="65" aria-valuemin="0" aria-valuemax="100">65%-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="progress mb-30">-->
<!--                                                <span>1 star</span>-->
<!--                                                <div class="progress-bar" role="progressbar" style="width: 85%;"-->
<!--                                                     aria-valuenow="85" aria-valuemin="0" aria-valuemax="100">85%-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <a href="#" class="font-xs text-muted">How are ratings calculated?</a>-->
<!--                                        </div>-->
                                    </div>
                                </div>
<!--                                <div class="comment-form">-->
<!--                                    <h4 class="mb-15">Add a review</h4>-->
<!--                                    <div class="product-rate d-inline-block mb-30">-->
<!--                                    </div>-->
<!--                                    <div class="row">-->
<!--                                        <div class="col-lg-8 col-md-12">-->
<!--                                            <form class="form-contact comment_form" action="#" id="commentForm">-->
<!--                                                <div class="row">-->
<!--                                                    <div class="col-12">-->
<!--                                                        <div class="form-group">-->
<!--                                                            <textarea class="form-control w-100" name="comment"-->
<!--                                                                      id="comment" cols="30" rows="9"-->
<!--                                                                      placeholder="Write Comment"></textarea>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                    <div class="col-sm-6">-->
<!--                                                        <div class="form-group">-->
<!--                                                            <input class="form-control" name="name" id="name"-->
<!--                                                                   type="text" placeholder="Name">-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                    <div class="col-sm-6">-->
<!--                                                        <div class="form-group">-->
<!--                                                            <input class="form-control" name="email" id="email"-->
<!--                                                                   type="email" placeholder="Email">-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                    <div class="col-12">-->
<!--                                                        <div class="form-group">-->
<!--                                                            <input class="form-control" name="website" id="website"-->
<!--                                                                   type="text" placeholder="Website">-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                                <div class="form-group">-->
<!--                                                    <button type="submit" class="button button-contactForm">Submit-->
<!--                                                        Review-->
<!--                                                    </button>-->
<!--                                                </div>-->
<!--                                            </form>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
                            </div>
                        </div>
<!--                        <div class="row mt-60">-->
<!--                            <div class="col-12">-->
<!--                                <h3 class="section-title style-1 mb-30">Related products</h3>-->
<!--                            </div>-->
<!--                            <div class="col-12">-->
<!--                                <div class="row related-products">-->
<!--                                    <div class="col-lg-3 col-md-4 col-12 col-sm-6">-->
<!--                                        <div class="product-cart-wrap small hover-up">-->
<!--                                            <div class="product-img-action-wrap">-->
<!--                                                <div class="product-img product-img-zoom">-->
<!--                                                    <a href="shop-product-full.html" tabindex="0">-->
<!--                                                        <img class="default-img" src="../../imgs/shop/product-2-1.jpg"-->
<!--                                                             alt="">-->
<!--                                                        <img class="hover-img" src="../../imgs/shop/product-2-2.jpg"-->
<!--                                                             alt="">-->
<!--                                                    </a>-->
<!--                                                </div>-->
<!--                                                <div class="product-action-1">-->
<!--                                                    <a aria-label="Quick view" class="action-btn small hover-up"-->
<!--                                                       data-bs-toggle="modal" data-bs-target="#quickViewModal-->
<!--"><i class="fi-rs-search"></i></a>-->
<!--                                                    <a aria-label="Add To Wishlist" class="action-btn small hover-up"-->
<!--                                                       href="shop-wishlist.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-heart"></i></a>-->
<!--                                                    <a aria-label="Compare" class="action-btn small hover-up"-->
<!--                                                       href="shop-compare.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-shuffle"></i></a>-->
<!--                                                </div>-->
<!--                                                <div class="product-badges product-badges-position product-badges-mrg">-->
<!--                                                    <span class="hot">Hot</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="product-content-wrap">-->
<!--                                                <h2><a href="shop-product-full.html" tabindex="0">Ulstra Bass-->
<!--                                                    Headphone</a></h2>-->
<!--                                                <div class="rating-result" title="90%">-->
<!--<span>-->
<!--</span>-->
<!--                                                </div>-->
<!--                                                <div class="product-price">-->
<!--                                                    <span>￥238.85 </span>-->
<!--                                                    <span class="old-price">￥245.8</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col-lg-3 col-md-4 col-12 col-sm-6">-->
<!--                                        <div class="product-cart-wrap small hover-up">-->
<!--                                            <div class="product-img-action-wrap">-->
<!--                                                <div class="product-img product-img-zoom">-->
<!--                                                    <a href="shop-product-full.html" tabindex="0">-->
<!--                                                        <img class="default-img" src="../../imgs/shop/product-3-1.jpg"-->
<!--                                                             alt="">-->
<!--                                                        <img class="hover-img" src="../../imgs/shop/product-4-2.jpg"-->
<!--                                                             alt="">-->
<!--                                                    </a>-->
<!--                                                </div>-->
<!--                                                <div class="product-action-1">-->
<!--                                                    <a aria-label="Quick view" class="action-btn small hover-up"-->
<!--                                                       data-bs-toggle="modal" data-bs-target="#quickViewModal-->
<!--"><i class="fi-rs-search"></i></a>-->
<!--                                                    <a aria-label="Add To Wishlist" class="action-btn small hover-up"-->
<!--                                                       href="shop-wishlist.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-heart"></i></a>-->
<!--                                                    <a aria-label="Compare" class="action-btn small hover-up"-->
<!--                                                       href="shop-compare.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-shuffle"></i></a>-->
<!--                                                </div>-->
<!--                                                <div class="product-badges product-badges-position product-badges-mrg">-->
<!--                                                    <span class="sale">-12%</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="product-content-wrap">-->
<!--                                                <h2><a href="shop-product-full.html" tabindex="0">Smart Bluetooth-->
<!--                                                    Speaker</a></h2>-->
<!--                                                <div class="rating-result" title="90%">-->
<!--<span>-->
<!--</span>-->
<!--                                                </div>-->
<!--                                                <div class="product-price">-->
<!--                                                    <span>￥138.85 </span>-->
<!--                                                    <span class="old-price">￥145.8</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col-lg-3 col-md-4 col-12 col-sm-6">-->
<!--                                        <div class="product-cart-wrap small hover-up">-->
<!--                                            <div class="product-img-action-wrap">-->
<!--                                                <div class="product-img product-img-zoom">-->
<!--                                                    <a href="shop-product-full.html" tabindex="0">-->
<!--                                                        <img class="default-img" src="../../imgs/shop/product-4-1.jpg"-->
<!--                                                             alt="">-->
<!--                                                        <img class="hover-img" src="../../imgs/shop/product-4-2.jpg"-->
<!--                                                             alt="">-->
<!--                                                    </a>-->
<!--                                                </div>-->
<!--                                                <div class="product-action-1">-->
<!--                                                    <a aria-label="Quick view" class="action-btn small hover-up"-->
<!--                                                       data-bs-toggle="modal" data-bs-target="#quickViewModal-->
<!--"><i class="fi-rs-search"></i></a>-->
<!--                                                    <a aria-label="Add To Wishlist" class="action-btn small hover-up"-->
<!--                                                       href="shop-wishlist.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-heart"></i></a>-->
<!--                                                    <a aria-label="Compare" class="action-btn small hover-up"-->
<!--                                                       href="shop-compare.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-shuffle"></i></a>-->
<!--                                                </div>-->
<!--                                                <div class="product-badges product-badges-position product-badges-mrg">-->
<!--                                                    <span class="new">New</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="product-content-wrap">-->
<!--                                                <h2><a href="shop-product-full.html" tabindex="0">HomeSpeak 12UEA-->
<!--                                                    Goole</a></h2>-->
<!--                                                <div class="rating-result" title="90%">-->
<!--<span>-->
<!--</span>-->
<!--                                                </div>-->
<!--                                                <div class="product-price">-->
<!--                                                    <span>￥738.85 </span>-->
<!--                                                    <span class="old-price">￥1245.8</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col-lg-3 col-md-4 col-12 col-sm-6">-->
<!--                                        <div class="product-cart-wrap small hover-up mb-0">-->
<!--                                            <div class="product-img-action-wrap">-->
<!--                                                <div class="product-img product-img-zoom">-->
<!--                                                    <a href="shop-product-full.html" tabindex="0">-->
<!--                                                        <img class="default-img" src="../../imgs/shop/product-5-1.jpg"-->
<!--                                                             alt="">-->
<!--                                                        <img class="hover-img" src="../../imgs/shop/product-3-2.jpg"-->
<!--                                                             alt="">-->
<!--                                                    </a>-->
<!--                                                </div>-->
<!--                                                <div class="product-action-1">-->
<!--                                                    <a aria-label="Quick view" class="action-btn small hover-up"-->
<!--                                                       data-bs-toggle="modal" data-bs-target="#quickViewModal-->
<!--"><i class="fi-rs-search"></i></a>-->
<!--                                                    <a aria-label="Add To Wishlist" class="action-btn small hover-up"-->
<!--                                                       href="shop-wishlist.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-heart"></i></a>-->
<!--                                                    <a aria-label="Compare" class="action-btn small hover-up"-->
<!--                                                       href="shop-compare.html" tabindex="0"><i-->
<!--                                                            class="fi-rs-shuffle"></i></a>-->
<!--                                                </div>-->
<!--                                                <div class="product-badges product-badges-position product-badges-mrg">-->
<!--                                                    <span class="hot">Hot</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                            <div class="product-content-wrap">-->
<!--                                                <h2><a href="shop-product-full.html" tabindex="0">Dadua Camera 4K-->
<!--                                                    2022EF</a></h2>-->
<!--                                                <div class="rating-result" title="90%">-->
<!--<span>-->
<!--</span>-->
<!--                                                </div>-->
<!--                                                <div class="product-price">-->
<!--                                                    <span>￥89.8 </span>-->
<!--                                                    <span class="old-price">￥98.8</span>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                        <div class="banner-img banner-big wow fadeIn f-none animated mt-50">-->
<!--                            <img class="border-radius-10" src="../../imgs/banner/banner-4.png" alt="">-->
<!--                            <div class="banner-text">-->
<!--                                <h4 class="mb-15 mt-40">Repair Services</h4>-->
<!--                                <h2 class="fw-600 mb-20">We're an Apple <br>Authorised Service Provider</h2>-->
<!--                            </div>-->
<!--                        </div>-->
                    </div>
                </div>
            </div>
        </div>
    </section>
</main>
<footer class="main">
    <section class="newsletter p-30 text-white wow fadeIn animated">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-7 mb-md-3 mb-lg-0">
                    <div class="row align-items-center">
                        <div class="col flex-horizontal-center">
                            <img class="icon-email" src="../../imgs/theme/icons/icon-email.svg" alt="">
                            <h4 class="font-size-20 mb-0 ml-3">订阅最新信息</h4>
                        </div>
                        <div class="col my-4 my-md-0 des">
                            <h5 class="font-size-15 ml-4 mb-0">立即获取<strong> 25元优惠券
                            </strong>首单购物。</h5>
                        </div>
                    </div>
                </div>
                <div class="col-lg-5">
                    <form class="form-subcriber d-flex wow fadeIn animated">
                        <input type="email" class="form-control bg-white font-small" placeholder="输入邮箱">
                        <button class="btn bg-dark text-white text-nowrap" type="submit">订阅</button>
                    </form>
                </div>
            </div>
        </div>
    </section>
    <section class="section-padding footer-mid">
        <div class="container pt-15 pb-20">
            <div class="row">
                <div class="col-lg-4 col-md-6">
                    <div class="widget-about font-md mb-md-5 mb-lg-0">
                        <div class="logo logo-width-1 wow fadeIn animated">
                            <a href="/url/index"><img src="../../imgs/theme/logo.svg" alt="logo"></a>
                        </div>
                        <h5 class="mt-20 mb-10 fw-600 text-grey-4 wow fadeIn animated">联系方式</h5>
                        <p class="wow fadeIn animated">
                            <strong>地址: </strong>云南省昆明市洋浦校区
                        </p>
                        <p class="wow fadeIn animated">
                            <strong>电话: </strong>221107410096
                        </p>
                        <p class="wow fadeIn animated">
                            <strong>工作时间: </strong>10:00 - 18:00, 周一 - 周日
                        </p>
                        <h5 class="mb-10 mt-30 fw-600 text-grey-4 wow fadeIn animated">关注我们</h5>
                        <div class="mobile-social-icon wow fadeIn animated mb-sm-5 mb-md-0">
                            <a href="#"><img src="../../imgs/theme/icons/icon-facebook.svg" alt=""></a>
                            <a href="#"><img src="../../imgs/theme/icons/icon-twitter.svg" alt=""></a>
                            <a href="#"><img src="../../imgs/theme/icons/icon-instagram.svg" alt=""></a>
                            <a href="#"><img src="../../imgs/theme/icons/icon-pinterest.svg" alt=""></a>
                            <a href="#"><img src="../../imgs/theme/icons/icon-youtube.svg" alt=""></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-2 col-md-3">
                    <h5 class="widget-title wow fadeIn animated">绿茶</h5>
                    <ul class="footer-list wow fadeIn animated mb-sm-5 mb-md-0">
                        <li><a href="/url/prolist">龙井</a></li>
                        <li><a href="/url/prolist">碧螺春</a></li>
                        <li><a href="/url/prolist">黄山毛峰</a></li>
                        <li><a href="/url/prolist">普洱茶</a></li>
                        <li><a href="/url/prolist">六堡茶</a></li>
                        <li><a href="/url/prolist">安化黑茶</a></li>
                    </ul>
                </div>
                <div class="col-lg-2  col-md-3">
                    <h5 class="widget-title wow fadeIn animated">红茶</h5>
                    <ul class="footer-list wow fadeIn animated">
                        <li><a href="/url/prolist">祁门红茶</a></li>
                        <li><a href="/url/prolist">正山小种</a></li>
                        <li><a href="/url/prolist">金骏眉</a></li>
                        <li><a href="/url/prolist">滇红</a></li>
                        <li><a href="/url/prolist">蒙顶黄芽</a></li>
                        <li><a href="/url/prolist">君山银针</a></li>
                    </ul>
                </div>
                <div class="col-lg-4">
                    <h5 class="widget-title wow fadeIn animated">下载 APP</h5>
                    <div class="row">
                        <div class="col-md-8 col-lg-12">
                            <p class="wow fadeIn animated">通过 App Store 或 Google Play </p>
                            <div class="download-app wow fadeIn animated">
                                <a href="#" class="hover-up mb-sm-4 mb-lg-0"><img class="active"
                                                                                  src="../../imgs/theme/app-store.jpg"
                                                                                  alt=""></a>
                                <a href="#" class="hover-up"><img src="../../imgs/theme/google-play.jpg" alt=""></a>
                            </div>
                        </div>
                        <div class="col-md-4 col-lg-12 mt-md-3 mt-lg-0">
                            <p class="mb-20 wow fadeIn animated">安全支付网关</p>
                            <img class="wow fadeIn animated" src="../../imgs/theme/payment-method.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="container pb-20 wow fadeIn animated">
        <div class="row">
            <div class="col-12 mb-20">
                <div class="footer-bottom"></div>
            </div>
            <div class="col-lg-6">
                <p class="float-md-left font-sm text-muted mb-0">&copy; 2024, <strong class="text-brand">Evara</strong>
                    - 网上茶叶商城 </p>
            </div>
            <div class="col-lg-6">
                <p class="text-lg-end text-start font-sm text-muted mb-0">
                    Designed by <a href="#" target="_blank">Alithemes.com</a>. All rights
                    reserved
                </p>
            </div>
        </div>
    </div>
</footer>
<div id="preloader-active">
    <div class="preloader d-flex align-items-center justify-content-center">
        <div class="preloader-inner position-relative">
            <div class="text-center">
                <h5 class="mb-5">Now Loading</h5>
                <div class="loader">
                    <div class="bar bar1"></div>
                    <div class="bar bar2"></div>
                    <div class="bar bar3"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../../js/vendor/modernizr-3.6.0.min.js"></script>
<script src="../../js/vendor/jquery-3.6.0.min.js"></script>
<script src="../../js/vendor/jquery-migrate-3.3.0.min.js"></script>
<script src="../../js/vendor/bootstrap.bundle.min.js"></script>
<script src="../../js/plugins/slick.js"></script>
<script src="../../js/plugins/jquery.syotimer.min.js"></script>
<script src="../../js/plugins/wow.js"></script>
<script src="../../js/plugins/jquery-ui.js"></script>
<script src="../../js/plugins/perfect-scrollbar.js"></script>
<script src="../../js/plugins/magnific-popup.js"></script>
<script src="../../js/plugins/select2.min.js"></script>
<script src="../../js/plugins/waypoints.js"></script>
<script src="../../js/plugins/counterup.js"></script>
<script src="../../js/plugins/jquery.countdown.min.js"></script>
<script src="../../js/plugins/images-loaded.js"></script>
<script src="../../js/plugins/isotope.js"></script>
<script src="../../js/plugins/scrollup.js"></script>
<script src="../../js/plugins/jquery.vticker-min.js"></script>
<script src="../../js/plugins/jquery.theia.sticky.js"></script>
<script src="../../js/plugins/jquery.elevatezoom.js"></script>
<script src="../../js/main.js?v=3.4"></script>
<script src="../../js/shop.js?v=3.4"></script>
<script src="../../js/custom.js"></script>

<script
        async
        defer
        src="http://localhost:8080/api/application/embed?protocol=http&host=localhost:8080&token=d4e06fd2bcb969b4">
</script>
</body>
</html>